<template>
	<div>
		<div class="publish-top">
			<div class="left-icon" @click="handleBack"> 
				<img src="../../../assets/images/left.png"/>
			</div>
			<p>更改密码</p>
		</div>
		<div class="change-content">
			<h1>更改密码</h1>
			<ul class="change-list">
				<li>
					<input type="password" placeholder="请输入当前密码" @change="changePass"/>
				</li>
				<li>
					<input type="password" placeholder="请输入新的密码" @change="changePass2"/>
				</li>
				<li>
					<input type="password" placeholder="确定新密码" @change="changePass3"/>
				</li>
			</ul>
			
		</div>
		<div class="sure" @click="handleSure">确定</div>
	</div>
</template>

<script>
	import axios from "axios";
	import user from '../../../utils/isLogin';


	export default{
		data(){
			return{
				pass : '',
				pass2 : '',
				pass3 : ''
			}
		},
		created(){
			
			let plusReady = ()=>{
				
			}
			if (window.plus) {
		      plusReady();
		    } else {
		      document.addEventListener("plusready", plusReady, false);
		    }
		},
		components:{
			
		},
		methods:{
			handleBack(){
				var change = plus.webview.currentWebview();
				plus.webview.close(change);
			
			},
			changePass (e){
				this.pass = e.target.value;
			},
			changePass2(e){
				this.pass2 = e.target.value;
			},
			changePass3(e){
				this.pass3 = e.target.value;
			},
			handleSure (){
				var {pass,pass2,pass3 }= this;
				if(pass == '' || pass2 == '' || pass3 == ''){
					plus.nativeUI.toast('请输入密码');
					return;
				}
				if(res.status == 1046){
					plus.nativeUI.toast('密码不正确~');
				}
				if(res.status == 1047){
					plus.nativeUI.toast('密码不一致~');
					
				}
				if(res.status == 1046){
					plus.nativeUI.toast('修改失败~');
				}
				var userId = JSON.parse(window.localStorage.getItem( 'userInfo' )).userId;
				axios.post(user.src+ '/index/user/get_user_information' , {
					userid: userId,
					password : pass,
					new_password : pass2,
					confirm_password : pass3
				})
				.then(function (res) {
					var res = res.data;
					if(res.status == 200){
						plus.nativeUI.toast('修改成功~')
						setTimeout(()=>{
							var change = plus.webview.getWebviewById('change.html');
							plus.webview.close(change);
						},1000)
					}
				})
				.catch(function (error) {
				   
				});
			}
		}
	}
	
	
</script>

<style lang='less' scoped>

html,body{
		padding: 0;
		margin: 0;
		width: 100%;
		height: 100%;
		background: #ffffff;

	}

	*{
		margin: 0;
		padding: 0;
	}
	ul,li{
		list-style: none;
	}
	.publish-top{
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 60px;
		background:@default-blue;
		box-shadow: 0px 0px 8px 1px #999;
		padding-top: 70px;
		display:flex;				
		.left-icon{
			width: 90px;
			
			img{
				width: 15px;
				height: 26px;
				margin-left: 31px;
			}
		}
		p{		
			width: 80%;
			color: #fff;
			font-size: 28px;
			text-align: center;
		}
		span{
			display: block;
			width: 170px;
			color: #fff;
			font-size: 28px;
			text-align: center;
		}
	}
	
	.change-content{
		padding: 130px 72px 0 72px;
		
		h1{
			height: 178px;
			line-height: 178px;
			font-size: 46px;
			color: #333;
		};
		
		.change-list{
			margin-bottom: 166px;
			padding-top: 24px;
			
			li{
				height: 86px;
				padding: 20px 0;
				border-bottom: 1px solid #cccccc;
		
				input{
					height: 86px;
					line-height: 86px;
					border: none;
					height: 100%;
					font-size: 26px;
					color: #999;
					outline: none;
				}
			}
		}
		
	}
	.sure{
		margin: 0 auto;
		width: 606px;
		height: 88px;
		line-height: 88px;
		font-size: 30px;
		font-weight: 300;
		color: #fff;
		text-align: center;
		border-radius: 36px;
		background: #00a2ff;
	}
	
</style>